<template>
    <view class="page">
        <view class="news-item-b" v-for="(item,index) in activityList" :key="index" @click="skipActivityDetail(item.id)" v-if="Index==IndexClassify.length">
            <view class="news-item-top">
                <img :src="item.img_url" mode="aspectFill"/>
                <img v-if="item.active_party_Info.type==1" class="icon" :src="File_Url+'official-activity.png'" />
            </view>
            <view class="news-item-bottom">
                <view class="news-content-text">
                    {{item.name}}
                </view>
                <view class="news-content-time">{{item.created_at.split(' ')[0]}}</view>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        name: "activityList",
        data(){
            return{
                activityList: [],
                page: 1,
                activityTotal: 0,

            }
        },
        onShow(){
          this.getActivity();
        },
        //下拉刷新
        onPullDownRefresh(){
            this.page = 1;
            this.getActivity();
            setTimeout(function () {
                uni.stopPullDownRefresh();
            },2000)
        },
        //触底叠加
        onReachBottom(){
            if (this.activityTotal != this.activityList.length){
                this.page++;
                this.getActivity();
            }

        },
        methods:{
            //获取活动列表
            async getActivity(){
                let params = {
                    user_token: uni.getStorageSync('userToken'),
                    limit: 10,
                    page: this.page
                }
                const res = await this.$api.getActivity(params);
                if (res.data.level == 'success'){
                    if (this.page == 1){
                        this.activityList = res.data.data
                    }else {
                        this.activityList = this.activityList.concat(res.data.data)
                    }
                    this.activityTotal = res.data.page_info.total;
                }
            },
            //跳转活动详情页面
            skipActivityDetail(id){
                uni.navigateTo({
                    url:'/pages/details/activityDetail/activityDetail?activityId='+id
                })
            },
        }
    }
</script>

<style scoped lang="scss">
    @import '~@/static/scss/mixin.scss';
    .page{
        background: #F8F8F8;
        width: 100vw;
        min-height: 100vh;
    }
    .news-item-b{
        margin-top: 10rpx;
        padding: 30rpx 30rpx 20rpx 30rpx;
        border-bottom: 2rpx solid #E5E5E5;
        background: #FFFFFF;
        .news-item-top{
            width: 100%;
            height: 360rpx;
            overflow: hidden;
            border-radius: 10rpx;
            position: relative;
            .icon{
                position: absolute;
                top: 0;
                right: 0;
                height: 120rpx;
                width: 120rpx;
            }
        }
        .news-item-bottom{
            padding-top: 18rpx;
            .news-content-text{
                width: 100%;
                max-height: 84rpx;
                line-height: 42rpx;
                @include ellipsis(2);
                margin-bottom: 10rpx;
                font-size: 30rpx;
            }
            .news-content-time{
                font-size: 24rpx;
                height: 28rpx;
                line-height: 28rpx;
                color: #9B9B9B;
            }
        }
    }
</style>